<template>
	<view class="wrap">
		<view class="search">
			<u-search @custom="search" v-model="listItems1" @search="search" @clear="clear"></u-search>
		</view>
		<scroll-view class="scroll-list" scroll-y="true">
			<!-- 如果 listItems 不为空，则展示 uni-list -->
			<uni-list v-if="listItems && listItems.length > 0">
				<uni-list-item v-for="(item, index) in listItems" :key="index" :title="item.title" :note="item.note"
					:to="'/pages/sys/news/new-detail?id=' + item.id"
					style="border: 1px solid #f5f5f5; margin-left: 8px; margin-right: 8px; margin-bottom: 8px;">
					<template v-slot:header>
						<view class="uni-thumb">
							<image :src="item.imageUrl" mode="aspectFill"></image>
						</view>
					</template>
				</uni-list-item>
			</uni-list>

			<!-- 如果 listItems 为空，则展示暂无数据的提示 -->
			<uni-view v-else class="noData">
				<image class="image" src="/static/aidex/noData.png"></image>
				<uni-view style="margin-top: 10px;">抱歉，未找到相关公告</uni-view>
			</uni-view>
		</scroll-view>

	</view>
</template>

<script>
	import config from '@/common/config.js';
	export default {
		data() {
			return {
				listItems1: '',
				listItems: [{
						title: "北约要把手伸到中国家门口？外交部连续三天回应",
						note: " 2024年07月11日 07:11 ",
						imageUrl: "https://gips2.baidu.com/it/u=821202356,690659925&fm=3028&app=3028&size=w931&q=75&n=0&f=PNG&fmt=auto&maxorilen2heic=2000000"
					},
					{
						title: "北约要把手伸到中国家门口？外交部连续三天回应",
						note: "2024年07月11日 07:11 ",
						imageUrl: "https://gips2.baidu.com/it/u=821202356,690659925&fm=3028&app=3028&size=w931&q=75&n=0&f=PNG&fmt=auto&maxorilen2heic=2000000"
					},
					{
						title: "北约要把手伸到中国家门口？外交部连续三天回应",
						note: "2024年07月11日 07:11",
						imageUrl: "https://gips2.baidu.com/it/u=821202356,690659925&fm=3028&app=3028&size=w931&q=75&n=0&f=PNG&fmt=auto&maxorilen2heic=2000000"
					},
					{
						title: "北约要把手伸到中国家门口？外交部连续三天回应",
						note: "2024年07月11日 07:11",
						imageUrl: "https://gips2.baidu.com/it/u=821202356,690659925&fm=3028&app=3028&size=w931&q=75&n=0&f=PNG&fmt=auto&maxorilen2heic=2000000"
					},
					{
						title: "北约要把手伸到中国家门口？外交部连续三天回应",
						note: "2024年07月11日 07:11",
						imageUrl: "https://gips2.baidu.com/it/u=821202356,690659925&fm=3028&app=3028&size=w931&q=75&n=0&f=PNG&fmt=auto&maxorilen2heic=2000000"
					},
					{
						title: "北约要把手伸到中国家门口？外交部连续三天回应",
						note: "2024年07月11日 07:11",
						imageUrl: "https://gips2.baidu.com/it/u=821202356,690659925&fm=3028&app=3028&size=w931&q=75&n=0&f=PNG&fmt=auto&maxorilen2heic=2000000"
					}
				]
			}
		},
		onLoad() {
			this.search()
		},
		methods: {
			search(value) {
				this.listItems1 = value
				this.getNewsBanner()
			},
			clear(value) {
				this.search()
			},
			getNewsBanner() {
				this.$u.api.news({
					"algorithmProcessId": "water_news_recommend",
					"param": {
						"data": {
							"title": this.listItems1
						}
					}
				}).then(res => {
					this.listItems = res.data.data.result.map(item => {
						return {
							...item,
							imageUrl: config.adminPath + item.news_coverphoto,
							note: item.news_declaretime
						};
					})
				})

			},
		}
	}
</script>

<style lang="scss" socped>
	@import 'style/newList.css';
</style>